<template>
  <div
      class="diy_edit seating_arrangement_edits page_seating_arrangement"
      id="seating_arrangement_edit"
  >
    <el-form
        :model="form"
        ref="ruleFormRef" 
		:rules="rules"
        label-width="auto"
        class="edit_seating_arrangement_form"
        size="large"
    >
      <el-row class="row_e">
          <el-col v-if="$check_field('ger','venue_name','/seating_arrangement/view') || $check_field('add','venue_name','/seating_arrangement/view') || $check_field('set','venue_name','/seating_arrangement/view')" :xs="24" :sm="24" :lg="24" class="el_form_item_warp">
    <el-form-item label="场次名称" prop="venue_name">
                      <el-input id="venue_name" v-model="form['venue_name']" placeholder="请输入场次名称"
                      v-if="(form['seating_arrangement_id'] && $check_field('set','venue_name','/seating_arrangement/view')) || (!form['seating_arrangement_id'] && $check_field('add','venue_name','/seating_arrangement/view'))" :disabled="disabledObj['venue_name_isDisabled']"></el-input>
            <div v-else-if="$check_field('ger','venue_name','/seating_arrangement/view')">{{form['venue_name']}}</div>
                    </el-form-item>
        </el-col>
            <el-col v-if="$check_field('ger','venue_date','/seating_arrangement/view') || $check_field('add','venue_date','/seating_arrangement/view') || $check_field('set','venue_date','/seating_arrangement/view')" :xs="24" :sm="24" :lg="24" class="el_form_item_warp">
    <el-form-item label="场次日期" prop="venue_date">
                <el-date-picker :disabled="disabledObj['venue_date_isDisabled']" v-if="(form['seating_arrangement_id'] && $check_field('set','venue_date','/seating_arrangement/view')) || (!form['seating_arrangement_id'] && $check_field('add','venue_date','/seating_arrangement/view'))" id="venue_date"
                            v-model="form['venue_date']" type="date" placeholder="选择日期">
            </el-date-picker>
            <div v-else-if="$check_field('ger','venue_date','/seating_arrangement/view')">{{form['venue_date']}}</div>
              </el-form-item>
        </el-col>
            <el-col v-if="$check_field('ger','venue_arrangement','/seating_arrangement/view') || $check_field('add','venue_arrangement','/seating_arrangement/view') || $check_field('set','venue_arrangement','/seating_arrangement/view')" :xs="24" :sm="24" :lg="24" class="el_form_item_warp">
    <el-form-item label="场次安排" prop="venue_arrangement">
                <el-input-number id="venue_arrangement" v-model.number="form['venue_arrangement']"
                             v-if="(form['seating_arrangement_id'] && $check_field('set','venue_arrangement','/seating_arrangement/view')) || (!form['seating_arrangement_id'] && $check_field('add','venue_arrangement','/seating_arrangement/view'))" :disabled="disabledObj['venue_arrangement_isDisabled']"></el-input-number>
            <div v-else-if="$check_field('ger','venue_arrangement','/seating_arrangement/view')">{{form['venue_arrangement']}}</div>
              </el-form-item>
        </el-col>
            <el-col v-if="$check_field('ger','arrange_person_times','/seating_arrangement/view') || $check_field('add','arrange_person_times','/seating_arrangement/view') || $check_field('set','arrange_person_times','/seating_arrangement/view')" :xs="24" :sm="24" :lg="24" class="el_form_item_warp">
    <el-form-item label="安排人次" prop="arrange_person_times">
                      <el-input id="arrange_person_times" v-model="form['arrange_person_times']" placeholder="请输入安排人次"
                      v-if="(form['seating_arrangement_id'] && $check_field('set','arrange_person_times','/seating_arrangement/view')) || (!form['seating_arrangement_id'] && $check_field('add','arrange_person_times','/seating_arrangement/view'))" :disabled="disabledObj['arrange_person_times_isDisabled']"></el-input>
            <div v-else-if="$check_field('ger','arrange_person_times','/seating_arrangement/view')">{{form['arrange_person_times']}}</div>
                    </el-form-item>
        </el-col>
        </el-row>
      <div v-if="$check_action('/seating_arrangement/view','set') || $check_action('/seating_arrangement/view','add') || $check_option('/seating_arrangement/table','examine')" class="footer">
        <el-button type="primary" @click="onSubmit" size="large">提交</el-button>
        <el-button @click="cancel()" size="large">取消</el-button>
      </div>
      <div v-else class="footer">
        <el-button @click="cancel()" size="large">取消</el-button>
      </div>
    </el-form>
  </div>
</template>

<script setup>
  import {ElMessage} from "element-plus";
  import {ref, onMounted} from "vue";
  import { $post, $get } from "@/api/Api.js";
  import storageHelper from "@/libs/StorageHelper";
  import {useStore} from "vuex";
  import { useRouter, useRoute } from "vue-router";
  import {
          $check_field,
          $fullUrl,
          $banseUrl,
          $check_action,
          $getUrlParams,
          filterSensitiveWords,
          $get_stamp,
          $get_rand,
          $toTime,
          $push
  } from "@/utils/utils.js";

  let router = useRouter();
  let route = useRoute();
  let store = useStore();
  let token = storageHelper.getToken() || null;
  let UserInfo = storageHelper.getUserInfo();
  let user_id = storageHelper.getUserInfo().user_id;
  let user_group = storageHelper.getUserInfo().user_group;
  let seating_arrangement_id = $getUrlParams().seating_arrangement_id;
  let url_add = ref("/api/seating_arrangement/add");
  let url_set = ref("/api/seating_arrangement/set");
  let field = ref("seating_arrangement_id")
  let url_get_obj = ref("/api/seating_arrangement/get_obj");
  let url_upload = ref("/api/seating_arrangement/upload");
  let ruleFormRef = ref(null);
  
  let rules = ref({
				  });

  let disabledObj = ref({
      "venue_name_isDisabled": false,
        "venue_date_isDisabled": false,
        "venue_arrangement_isDisabled": false,
        "arrange_person_times_isDisabled": false,
    });
  let form = ref({
    "venue_name":  '', // 场次名称
      "venue_date":  '', // 场次日期
      "venue_arrangement":  0, // 场次安排
      "arrange_person_times":  '', // 安排人次
      "seating_arrangement_id": 0, // ID
  });
  
    
    
            let arrange_person_times_multiple_value = ref([]);
        // 安排人次选项列表
  let list_arrange_person_times = ref([""]);
  
                                                                                    //提交前验证事件
  let submit_check = () => {
              if (!param.venue_date){
      return "场次日期不能为空";
    }
                          };
  // 点击取消
  let cancel = () => {
    router.go(-1);
  };
  // 点击提交
  let onSubmit = async () => {
    let valid = await ruleFormRef.value.validate();
    if (valid) {
      // 提交表单
      if (seating_arrangement_id) {
        // 编辑
        delete form.value.update_time;
              $post(url_set.value + "?seating_arrangement_id=" + seating_arrangement_id, form.value).then((res) => {
          if (res.result) {
          router.push("/home/seating_arrangement/table");
          ElMessage.success("提交成功！");
          } else if (res.error) {
            ElMessage.error(res.error.message);
          }
        });

      } else {
        // 新增
              $post(url_add.value, form.value).then((res) => {
          if (res.result) {
              router.push("/home/seating_arrangement/table");
              ElMessage.success("提交成功！");
          } else if (res.error) {
            ElMessage.error(res.error.message);
          }
        });

      }
    } else {
      ElMessage.error(msg);
    }
  };
  // 查询数组对象某个是否包含某个值,返回对应对象
  let getObj = (arr, val) => {
    let obj = arr.find((item) => item.user_id == val);
    let ret = "";
    if (obj) {
      if (obj.nickname) {
        ret = obj.nickname;
      } else {
        ret = obj.username;
      }
    }
    return ret;
  };
  //获取对象之前
  let get_obj_before = (param) => {
    var formArr = "";
                                  if(form.value && formArr){
      Object.keys(form.value).forEach(key => {
        Object.keys(formArr).forEach(dbKey => {
          if(key === dbKey){
            disabledObj.value[key+'_isDisabled'] = true;
          }
        })
      })
    }
            if (form.value["venue_date"] && isTimestamp(form.value["venue_date"])) {
      form.value["venue_date"] = $toTime(parseInt(form.value["venue_date"]), "YYYY-MM-DD")
    }
              localStorage.removeItem('form')
    return param;
  }
  // js判断字段是否是时间戳格式
  let isTimestamp = (value) => {
    return /^\d{10}$/.test(value) || /^\d{13}$/.test(value);
  }
  //获取对象之后
  let get_obj_after = (json, func) => {
                                                          if (form.value["venue_date"] == "0000-00-00") {
            form.value["venue_date"] = null;
          }
          if (parseInt(form.value["venue_date"]) > 9999) {
            form.value["venue_date"] = $toTime(parseInt(form.value["venue_date"]), "YYYY-MM-DD")
          }
                                                                                  if (form.value.arrange_person_times){
                  arrange_person_times_multiple_value = form.value.arrange_person_times.split(",")
          }
                  }
  let is_view = () => {
    var bl = user_group == "管理员";
    if (!bl) {
      bl = $check_action('/seating_arrangement/table', 'add');
      console.log(bl ? "你有表格添加权限视作有添加权限" : "你没有表格添加权限");
    }
    if (!bl) {
      bl = $check_action('/seating_arrangement/table', 'set');
      console.log(bl ? "你有表格添加权限视作有修改权限" : "你没有表格修改权限");
    }
    if (!bl) {
      bl = $check_action('/seating_arrangement/view', 'add');
      console.log(bl ? "你有视图添加权限视作有添加权限" : "你没有视图添加权限");
    }
    if (!bl) {
      bl = $check_action('/seating_arrangement/view', 'set');
      console.log(bl ? "你有视图修改权限视作有修改权限" : "你没有视图修改权限");
    }
    if (!bl) {
      bl = $check_action('/seating_arrangement/view', 'get');
      console.log(bl ? "你有视图查询权限视作有查询权限" : "你没有视图查询权限");
    }
    console.log(bl ? "具有当前页面的查看权，请注意这不代表你有字段的查看权" : "无权查看当前页，请注意即便有字段查询权限没有页面查询权限也不行");
    return bl;
  }
  // 获取详情
  let get_seating_arrangement_obj = async () => {
    let list = await $get("/api/seating_arrangement/get_obj?seating_arrangement_id=" + seating_arrangement_id);
    form.value = list.result.obj;
    get_obj_after();
  };
  onMounted(() => {
                    if (seating_arrangement_id) {
      get_seating_arrangement_obj();
    }else {
      get_obj_before();
      get_obj_after();
    }

  });
</script>

<style scoped lang="less">
  .diy_edit {
    width: 100%;

    .edit_seating_arrangement_form {
      max-width: 80%;
      margin: 90px auto;

      .fn {
        width: 100%;
      }
    }

    img {
      width: 100px;
      height: 100px;
    }

    .edit_list_seating_arrangement_sell {
      width: 80%;
      margin: 90px auto;
    }

    .footer {
      text-align: center;
    }
  }
</style>
  